import Card from "antd/es/card/Card";
import { useParams,useHistory } from "react-router-dom/cjs/react-router-dom.min";
import JcdHandle from "../../../../../../utils/apis/JcdHandle";
import { useEffect,useState } from "react";
import FetchHelper from "../../../../../../utils/helper/fetch-helper";
import TextArea from "antd/es/input/TextArea";
import { Button, Checkbox, Form, Input, Select, Space, Table, Upload } from 'antd';
import { useLocation } from "react-router-dom/cjs/react-router-dom";

export default function JcdAdd(props){
    const keyPath=useParams()?.keyPath;
    const node=useLocation()?.state?.node;
    const jcdlx=node?.key ? node?.key : node;
    console.log('jcdlx',jcdlx)
    const [form]=Form.useForm();
    const [jcdAddDynamicForms, setJcdAddDynamicForms] = useState();
    useEffect(() => {
        let promise;
        if(jcdlx === '河道'){
            promise=JcdHandle.hd_look()
        }else if(jcdlx === '雨情'){
            promise=JcdHandle.yq_look()
        }else if(jcdlx === '水库'){
            promise=JcdHandle.sk_look()
        }else if(jcdlx=== '洪涝'){
            promise=JcdHandle.hl_look()
        }else if(jcdlx === '林区卡口'){
            promise=JcdHandle.lqkk_look()
        }else{
            promise=JcdHandle.gklwt_look()
        }
        promise.then(datas => {
            setJcdAddDynamicForms(datas);
            form.setFieldsValue({
            //    cztdl:cztdl,
            //    cztzl:cztzl,
               jcdlx:jcdlx
            })
            
        })
    },[jcdlx,form])

    const data=[];
     //保存
     const onFinish=(values)=>{
        let promise;
        if(jcdlx === '河道'){
            promise=FetchHelper.postJson(`/admin-api/ybyj/hdjc`,values)
        }else if(jcdlx === '雨情'){
            promise=FetchHelper.postJson(`/admin-api/ybyj/yqjc`,values)
        }else if(jcdlx === '水库'){
            promise=FetchHelper.postJson(`/admin-api/ybyj/skjc`,values)
        }else if(jcdlx=== '洪涝'){
            promise=FetchHelper.postJson(`/admin-api/ybyj/hljc`,values)
        }else if(jcdlx === '林区卡口'){
            promise=FetchHelper.postJson(`/admin-api/ybyj/lqkkjcData`,values)
        }else{
            promise=FetchHelper.postJson(`/admin-api/ybyj/gklwtjcData`,values)
        }
        promise.then(alert('新增成功！'))  
     }
     //取消按键的路由设置
     const history = useHistory()
     const quxiaoHandle = () => {
         history.push(`/manager/jcsjxxcd`)
     }

    return <div className='layout-h h100' style={{
        overflow: "scroll"
    }}>
        
        <Card className='h100 fill'>
            <Form method="post" 
            onFinish={onFinish}
            form={form}>
                <header style={{
                    fontSize: 20,
                    fontWeight: "bold"
                }}>设施</header>
                <hr />
                <div className="InputForm" style={{
                    flex:"flex",
                    flexWrap:"wrap"
                }}>
                    {jcdAddDynamicForms !== undefined && jcdAddDynamicForms.map(formItem => {
                        let node;
                        switch (formItem.type) {
                            case 'Textarea':
                                node = <TextArea></TextArea>;
                                break;
                            case 'input':
                            default:
                                node = <Input style={{
                                    width: "90%"
                                }} 
                                // defaultValue={formItem.alias==="承灾体大类"?formItem.alias:undefined}
                                
                                />
                        }
                        // const initialValue=cztAddDynamicForms[formItem.alias]==="承灾体大类"?cztAddDynamicForms[formItem.alias]:undefined;
                        return <div style={{
                            flexBasis:"33%",
                            marginBottom:"10px"
                        }}> 
                        <Form.Item
                            label={formItem.alias}
                            name={formItem.name}
                            rules={[{
                                required: true
                            }]}
                            
                            // initialValue={formItem.alias==="承灾体小类"?cztkeyPath:undefined}
                        >
                            {node}
                        </Form.Item>
                        </div>
                    })}
                </div>
                <Table columns={[
                    {
                        title: '代码',
                        dataIndex: 'dm',
                        key: 'dm',

                    },
                    {
                        title: '指标名称',
                        dataIndex: 'zbmc',
                        key: 'zbmc',
                    },
                    {
                        title: '数量',
                        dataIndex: 'sl',
                        key: 'sl',
                    },
                    {
                        title: '计量单位',
                        dataIndex: 'jldw',
                        key: 'jldw',
                    }
                ]} dataSource={data} />

                <div className="layout-h">
                <Button  className="btn1"
                type="primary"
                htmlType="submit" 
                >新增</Button>

                <Button onClick={quxiaoHandle} className="btn2">取消</Button>
                </div>

            </Form>
        </Card>
    </div>
}